<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>

<%
	request.setAttribute("title", "服务详情");
	request.setAttribute("modelConfigPath", "ser");
%>

<%@ include file="/WEB-INF/views/shared/master/contentHeader.jsp"%>
<style type="text/css">
.content {
	margin-bottom: 28px;
}
</style>
<t:panel cssClass="panel-flat form-detailed" customBody="true"
	customHead="true">
	<div class="detailed-navbar-content panel-body content">
		<t:form commandName="goodsService"
			action="/admin/ser/goodsService/save" method="post"
			cssClass="form-horizontal">
			<div class="hide">
				<t:hidden path="id" />
				<t:hidden path="goodsSortCode" />
				<t:hidden path="deleteMark" />
				<t:input path="largeMapId" type="hidden" />
				<t:input path="thumbnailId" type="hidden" />
			</div>
			<t:formgroup>
				<t:label path="serviceGoodsName" cssClass="col-sm-2" />
				<t:input path="serviceGoodsName" colClass="col-sm-6" />
				<t:label path="serviceGoodsNum" cssClass="col-sm-2" />
				<t:input path="serviceGoodsNum" colClass="col-sm-2" />
			</t:formgroup>
			<t:formgroup>
				<t:label path="serviceTypeName" cssClass="col-sm-2" />
				<t:select2 path="serviceTypeName" colClass="col-sm-2" />
				<t:label path="serviceName" cssClass="col-sm-2" />
				<t:select2 path="serviceName" colClass="col-sm-2" />
			</t:formgroup>
			<t:formgroup>
				<t:label path="serviceAddress" cssClass="col-sm-2" />
				<t:select2 path="serviceProvince" colClass="col-sm-2" />
				<t:select2 path="serviceCity" colClass="col-sm-2" />
				<t:select2 path="serviceCounty" colClass="col-sm-2" />
			</t:formgroup>
			<t:formgroup>
				<t:label path="goodStoreId" cssClass="col-sm-2" />
				<t:select2 path="goodStoreId" colClass="col-sm-4" />
				<t:label path="goodStore.storePhone" cssClass="col-sm-2" />
				<t:input path="goodStore.storePhone" id="phone" colClass="col-sm-4" readonly="true" disabled="true" />
			</t:formgroup>
			<t:formgroup>
				<t:label path="goodsOriginalPrice" cssClass="col-sm-2" />
				<t:input path="goodsOriginalPrice" colClass="col-sm-2" />
				<t:select2 path="goodsOriginalCurrency" colClass="col-sm-2" />
				<t:label path="goodsMaketPrice" cssClass="col-sm-2" />
				<t:input path="goodsMaketPrice" colClass="col-sm-2" />
				<t:select2 path="goodsMaketCurrency" colClass="col-sm-2" />
			</t:formgroup>
			<t:formgroup>
				<div class="col-sm-6">
					<t:label path="thumbnailId" cssClass="col-sm-4" />
					<div class="col-sm-4">
						<c:if test="${goodsService.thumbnailId!=null && goodsService.thumbnailId!=''}">
							<img style="width: 100px; height: 80px;" id="smallPicShow" src="${tfn:getFileUrl(goodsService.thumbnailId)}" />
						</c:if>
						<c:if test="${goodsService.thumbnailId ==null || goodsService.thumbnailId==''}">
							<img style="width: 100px; height: 80px;" id="smallPicShow" src="<c:url value='/images/we/invitationIndex/bg1.jpg' />" />
						</c:if>
					</div>
					<div class="col-sm-4">
						<label>加载进度</label>
						<div style="width: 100px; height: 10px; margin-top: 0.5rem; border: 2px solid #afafaf; border-radius: 15px;"class="smallParent">
							<div style="width: 0px; height: 7px; background-color: #afafaf" class="smallProgress"></div>
						</div>
						<button type="button" class="btn-info" id="deleteSmallPic" style="padding-left: 10px; border-radius: 6px; margin-top: 1rem">删除图片</button>
					</div>
				</div>
				<div class="col-sm-6">
					<t:label path="largeMapId" cssClass="col-sm-4" />
				<div class="col-sm-4">
					<c:if test="${goodsService.largeMapId!=null && goodsService.largeMapId!=''}">
						<img style="width: 100px; height: 80px;" id="bigPicShow" src="${tfn:getFileUrl(goodsService.largeMapId)}" />
					</c:if>
					<c:if test="${goodsService.largeMapId ==null || goodsService.largeMapId==''}">
						<img style="width: 100px; height: 80px;" id="bigPicShow" src="<c:url value='/images/we/invitationIndex/bg1.jpg' />" />
					</c:if>
				</div>
				<div class="col-sm-4">
					<label>加载进度</label>
					<div style="width: 100px; height: 10px; margin-top: 0.5rem; border: 2px solid #afafaf; border-radius: 15px;" class="bigParent">
						<div style="width: 0px; height: 7px; background-color: #afafaf" class="bigProgress"></div>
					</div>
					<button type="button" class="btn-info" id="deleteBigPic" style="padding-left: 10px; border-radius: 6px; margin-top: 1rem">删除图片</button>
				</div>
				</div>
			</t:formgroup>
			<t:formgroup>
				<t:label path="serviceGoodsDescription" cssClass="col-sm-2" />
				<t:ueditor path="serviceGoodsDescription" style="height:100px;" colClass="col-sm-10" />
			</t:formgroup>
			<t:formgroup>
				<t:label path="goodsContent" cssClass="col-sm-2" />
				<t:ueditor path="goodsContent" style="height:100px;" colClass="col-sm-10" />
			</t:formgroup>
		</t:form>
	</div>
	<div class="navbar-fixed-bottom">
		<t:panelFoot headingBtnCssClass="heading-btn pull-right-important">
			<t:button icon="icon-floppy-disk" onclick="saveData()"
				cssClass="btn-info" csize="sm">保存</t:button>
		</t:panelFoot>
	</div>
</t:panel>


<script type="text/javascript">
	function saveData() {

		if (loadPrice() == false || loadMaketPrice() == false) {
			return;
		}

		if (!$("form:first").valid()) {
			return;
		}
		$("form:first").submit();
	}

	/*-------------------- 服务商品的二级级联---------------------- */
	$(function() {
		var options = {}
		options.links = [];
		options.links.push({
			id : 'serviceTypeName',
			selector : '#serviceTypeName',
			paramName : 'serviceTypeName',
			depend : 'first'
		});
		options.links.push({
			id : 'serviceName',
			selector : '#serviceName',
			paramName : 'serviceName',
			depend : 'serviceTypeName'
		});

		$.linker(options);
	})

	/*-------------------- 省 市 区 的级联---------------------- */
	$(function() {
		var options = {}
		options.links = [];
		options.links.push({
			id : 'serviceProvince',
			selector : '#serviceProvince',
			paramName : 'province',
			depend : 'first'
		});
		options.links.push({
			id : 'serviceCity',
			selector : '#serviceCity',
			paramName : 'city',
			depend : 'serviceProvince'
		});
		options.links.push({
			id : 'serviceCounty',
			selector : '#serviceCounty',
			paramName : 'county',
			depend : 'serviceCity'
		});

		$.linker(options);
	})

	/*-------------------- 选择店铺后， 动态获得联系电话---------------------- */
	$(function() {
		$("#goodStoreId").on("change", function() {
			var storeId = $("#goodStoreId").val();
			loadStorePhone(storeId);
		})
		var storeId = $("#goodStoreId").val();
		loadStorePhone(storeId);
	});

	function loadStorePhone(storeId) {
		if ($.isNull(storeId)) {
			return;
		}
		var url = $.getVirtualPath()+ "/admin/ser/goodsService/getPhoneByStoreId";
		/* var storePhone=$.getJsonPost(url); */
		$.post(url, {storeId : storeId}, function(phone) {
			if (phone == "1") {
				$("#phone").val("");
			} else {
				$("#phone").val(phone);
			}

		});
	}

	/*--------------------选择币种后，不同币种的不同验证与错误提示-------------------- */
	$(function() {

		$("#goodsOriginalPrice").on("change", function() {
			loadPrice();
		})

		$("#goodsOriginalCurrency").on("change", function() {
			loadPrice();
		})

		$("#goodsMaketPrice").on("change", function() {
			loadMaketPrice();
		})

		$("#goodsMaketCurrency").on("change", function() {
			loadMaketPrice();
		})

	});

	function loadPrice() {
		var goodsOriginalPrice = $("#goodsOriginalPrice").val();
		var goodsOriginalCurrency = $("#goodsOriginalCurrency").val();

		if (goodsOriginalCurrency == "yuan") {
			var reg = /(^((\d{1,9}.\d{1,2})|(\d{1,9}))$)/;
			if (!reg.test(goodsOriginalPrice)) {
				var errorConfig = {
					content : "请输入正整数或1-2位小数",
					alignTo : 'target',
					alignX : "left",
					alignY : 'center',
					showOn : 'none',
					bgImageFrameSize : 9,
					offsetX : 5
				};
				$("#goodsOriginalPrice").poshytip(errorConfig).poshytip("show");

				return false;
			} else {

				$("#goodsOriginalPrice").poshytip("destroy");
				return true;
			}
		}

		if (goodsOriginalCurrency == "jindou") {
			var reg = /(^((\d{1,9}))$)/;
			if (!reg.test(goodsOriginalPrice)) {
				var errorConfig = {
					content : "请输入正整数",
					alignTo : 'target',
					alignX : "left",
					alignY : 'center',
					showOn : 'none',
					bgImageFrameSize : 9,
					offsetX : 5
				};
				$("#goodsOriginalPrice").poshytip(errorConfig).poshytip("show");
				return false;
			} else {
				$("#goodsOriginalPrice").poshytip("destroy");
				return true;
			}
		}
	};

	function loadMaketPrice() {
		var goodsMaketPrice = $("#goodsMaketPrice").val();
		var goodsMaketCurrency = $("#goodsMaketCurrency").val();
		if (goodsMaketCurrency == "yuan") {
			var reg = /(^((\d{1,9}.\d{1,2})|(\d{1,9}))$)/;
			if (!reg.test(goodsMaketPrice)) {
				var errorConfig = {
					content : "请输入正整数或1-2位小数",
					alignTo : 'target',
					alignX : "left",
					alignY : 'center',
					showOn : 'none',
					bgImageFrameSize : 9,
					offsetX : 5
				};
				$("#goodsMaketPrice").poshytip(errorConfig).poshytip("show");

				return false;
			} else {

				$("#goodsMaketPrice").poshytip("destroy");
				return true;
			}
		}

		if (goodsMaketCurrency == "jindou") {
			var reg = /(^((\d{1,9}))$)/;
			if (!reg.test(goodsMaketPrice)) {
				var errorConfig = {
					content : "请输入正整数",
					alignTo : 'target',
					alignX : "left",
					alignY : 'center',
					showOn : 'none',
					bgImageFrameSize : 1,
					offsetX : 5
				};
				$("#goodsMaketPrice").poshytip(errorConfig).poshytip("show");
				return false;
			} else {
				$("#goodsMaketPrice").poshytip("destroy");
				return true;
			}
		}
	}

	/*-------------------- 上传图片 点击就加入云端服务器---------------------- */
	$(function() {
		$("#smallPicShow").on('click', function(e) {
			$(".smallProgress").width(0);
			$("#thumbnailId").startCosFileUpload({
				fillImg : "#smallPicShow",
				progressCallback:function(curr, sha1){
					$(".smallParent").show();
					$(".smallProgress").width(0);
					$(".smallProgress").width(sha1*96);
				}
			});
		});
		$("#bigPicShow").on('click', function(e) {
			$(".bigProgress").width(0);
			$("#largeMapId").startCosFileUpload({
				fillImg : "#bigPicShow",
				progressCallback:function(curr, sha1){
					$(".bigParent").show();
					$(".bigProgress").width(0);
					$(".bigProgress").width(sha1*96);
				}
			});
		});
	});

	/*--------------------删除上传的图片,页面和数据库都删除---------------------- */
	$(function() {
		$("#deleteSmallPic").on('click',function(e) {
		$(".smallProgress").width(0);
		$("#smallPicShow").attr("src",$.getVirtualPath()+ "/images/we/invitationIndex/bg1.jpg");
		$("#thumbnailId").val("");
			console.log(result);
				});

		$("#deleteBigPic").on('click',function(e) {
			$(".bigProgress").width(0);
			$("#bigPicShow").attr("src",$.getVirtualPath()+ "/images/we/invitationIndex/bg1.jpg");
			$("#largeMapId").val("");
			    console.log(result);
				});
	});
</script>
<%@ include file="/WEB-INF/views/shared/base/scripts/jqueryui.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formselects.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formstyling.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/limitless/default/formpickers.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/editor/ueditor.jsp"%>
<%@ include file="/WEB-INF/views/shared/master/dialog.jsp"%>
<%@ include file="/WEB-INF/views/shared/base/scripts/tools/upload-cos.jsp"%>
<%@ include file="/WEB-INF/views/shared/master/contentFooter.jsp"%>